<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        .home{
            display: flex;
            flex-direction: column;
            width: 100%;
            height: 100vh;
        }
        .WeChatMain{
            flex: 1;
        }
        .navigation{
            display: flex;
            justify-content: space-around;
            border-top: 1px solid #b7b7b7;
            height: 60px;
        }
        .navigation > li{
            list-style: none;
        }
        .navigation > li > a > div{
            width: 50px;
            height: 50px;
            background-color: #4a78c2;
        }
    </style>
</head>
<body>
<div class="home">
    <iframe name="wyframe" class="WeChatMain"></iframe>
    <ul class="navigation">
        <li><a href="ex3.html" target="wyframe"><div></div>信息</a></li>
        <li><a href="ex2.html" target="wyframe"><div></div>通讯录</a></li>
        <li><a href="ex1.html" target="wyframe"><div></div>发现</a></li>
        <li><a href="javascript:void(0)" target="wyframe"><div></div>我的</a></li>
    </ul>
</div>
</body>
</html>